<template>
  <d2-container :filename="filename">
    <template slot="header">Page 1 header</template>
    <div style="padding: 8px 0 5px 0;display:inline-block;width:100%">
      <div class="pull-left">
        <router-link to="/client/create">
          <el-button
            type="primary"
            size="small"
          >
            <i class="el-icon-plus"></i> 新建客户端
          </el-button>
        </router-link>
      </div>
      <div class="pull-right">
        <el-button
          type="danger"
          size="small"
        >
          <i class="el-icon-delete"></i> 删除用户
        </el-button>
      </div>
    </div>

    <el-table :data="paged.items">
      <el-table-column
        type="selection"
        width="50"
      ></el-table-column>
      <el-table-column
        label="应用名称"
        prop="clientName"
      ></el-table-column>
      <el-table-column
        label="#"
        width="100"
      ></el-table-column>
    </el-table>
    <awesome-pagination></awesome-pagination>
  </d2-container>
</template>

<script>
import Vue from "vue";
import { GetClientList } from "@/api/client/list";
import { AwesomePagination } from "awesome-element-ui";
Vue.use(AwesomePagination);


export default {
  name: "client-index",
  data() {
    return {
      filename: __filename,
      /**请求接口返回 */
      paged: {}
    };
  },
  // components: { "awesome-pagination": Pagination },
  methods: {
    getClientList: function() {
      GetClientList().then(paged => (this.paged = paged));
    }
  },
  created() {
    this.getClientList();
  }
};
</script>
